<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link rel="stylesheet" href="./css/base.css">
	<link rel="stylesheet" href="./css/vip.css">
	<link rel="icon" href="./img/favicon.ico">
	<title>会员中心</title>
</head>
<body>
	<!-- f1 -->
	<div class="f1">
		<div class="container">
			<div class="row">
				<div class="col-1">
					<img src="img/210928004729927_188x50_4237.png" >
				</div>
				<div class="col-7">
					<ul>
						<li><a href="homepage.html">音乐</a></li>
						<li><a href="#">现场</a></li>
						<li><a href="#">
						<img src="img/皇冠.png" >
						会员中心
						</a></li>
						<li><a href="fanxiang.html">凡响计划</a></li>
						<li><a href="#">客户端下载</a></li>
					</ul>
				</div>
				<div class="col-4">
					<input placeholder="搜索歌曲、歌手、MV">
					<img src="./img/206搜索-线性.png">
					<div>
					<img src="img/no-login.png">
					<div class="log_popup">
						<p><span>一</span>登录后可专享<span>一</span></p>
						<div class="row">
							<div class="col-4">
								<img src="./img/乐谱编辑.png">
								<p>试听记录同步</p>
							</div>
							<div class="col-4">
								<img src="./img/彩铃.png">
								<p>订购酷炫铃音</p>
							</div>
							<div class="col-4">
								<img src="./img/无损音质.png">
								<p>下载无损音乐</p>
							</div>
						</div>
						<div class="row">
							<div class="col-6">
								<span class="lgin">登陆</span>
								</div>
							<div class="col-6">
								<span><a href="login.html">注册</a></span>
								</div>
						</div>
					</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- f2 -->
	<div class="f2">
		<div class="container-fluid">
			<div class="container">
				<div class="row">
					<div class="col">
						<div class="box">
							<p>开通白金会员畅享</p>
							<p>专属曲库&无损品质</p>
							<p>免费不限量下载</p>
							<p id="login">立即登录</p>
						</div>
						<p><span>《咪咕音乐会员服务权益》</span>已更新，请查阅</p>
					</div>
					<div class="col-8">
						<h1>-<span>会员权益</span>-</h1>
						<div class="row">
							<div class="col">
								<div class="img-box">
									<img src="img/200507144210560_34x31_8549.png" >
								</div>
								<p>专属曲库</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/200507144238727_35x33_606.png" >
								</div>
								<p>无损音乐</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/200602135127454_31x31_6606.png" >
								</div>
								<p>专享数字</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/200602140712327_31x33_5123.png" >
								</div>
								<p>专享彩铃</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/200602140821669_33x30_7148.png" >
								</div>
								<p>超清mv</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/200602140924765_33x30_8187.png" >
								</div>
								<p>超清直播</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/200602143550917_34x27_4528.png" >
								</div>
								<p>专享演唱</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/20060214365774_34x27_3292.png" >
								</div>
								<p>广告</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/20060214374440_35x34_5516.png" >
								</div>
								<p>道具劵</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/20060214384561_34x27_197%20(1).png" >
								</div>
								<p>弹幕特权</p>
							</div>
							<div class="col">
								<div class="img-box">
									<img src="./img/20060214394201_29x35_4968.png" >
								</div>
								<p>成长加速</p>
							</div>
						</div>
						<div class="text-box">
							<p>专属曲库</p>
							<p>百万付费歌曲无限量畅听下载</p>
							<p>白金会员享全站付费曲库歌曲(不含数字专辑)免费无限量试听下载。白金会员畅听版可无限试听，享300首/月付费下</p>
							<p>载特权(数字专辑除外)</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="logincover">
		<div class="login-inter">
			<img src="./img/关闭.png" id="clo">
			<a href="login.html">去注册</a>
			<div class="row">
				<div class="cur" id="col">短信登录</div>
				<div id="col">密码登陆</div>
				<div id="col">SIM登录</div>
			</div>
			<div id="hint">
				<img src="./img/err.png" >
				<img src="img/ok.png" >
				<span>手机号格式不正确</span>
				<span>手机号可用</span>
			</div>
			<div id="phon">
			<input placeholder="手机号">
			<div class="row">
				<div class="col-7">
					<input placeholder="请输入验证码"/>
				</div>
				<div class="col-5">
					<p>获取验证码</p>
				</div>
			</div>
			<p>登录</p>
			</div>
			<div id="pwd">
				<input placeholder="手机号/邮箱/用户名">
				<input placeholder="密码">
				<div id="sign">
						<div class="col">
							<input type="checkbox"/>
							<span>自动登录</span>
						</div>
						<div class="col">
							<span>忘记密码</span>
							<span>|</span>
							<a href="login.html">注册</a>
						</div>
				</div>
				<div id="tisi">
				<img src="./img/err.png" >
				<img src="img/ok.png" >
				<span>密码长度在5~12位</span>
				<span>密码长度符合</span>
				</div>
				<p>登录</p>
				<span>手机号或密码不正确</span>
			</div>
			<div id="SIM">
				<input placeholder="手机号">
				<p>登录</p>
				<span>温馨提示：</span>
				<span>1.“SIM登录” 是由中国移动提供的PC端安全登录服务</span>
				<span>2.输入手机号点击 “登录”，即可在手机上查看登录请求，并使用手机进行登录授权</span>
			</div>
			<div class="text">
				登录即同意<span>《咪咕用户服务协议》</span>
				和<span>《咪咕隐私权政策》</span>
			</div>
		</div>
	</div>
		<!-- f3 -->
		<div class="f3">
			<div class="container">
				<img src="./img/21061717572975_1450x350_4487.png" >
			</div>
		</div>
		<!-- f4 -->
		<div class="f4">
			<div class="container">
				<p>专属付费曲库</p>
				<div class="row">
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="img/AS23fc25cbbaebed895d6c95c467c7a91d.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>新地球</p>
									<p>林俊杰</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="./img/AS2a095e20e4fc18327b45368ae3cbf9a2.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>Yesterday Once More</p>
									<p>Carpenters</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="./img/AS8ceea85db6df59de720b0143cdc37d2a.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>敢爱敢做(电影《神奇两女侠》主..</p>
									<p>林子祥</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="./img/AS3961c0da07f99f7ec54172c3aa6b2012.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>情人知己</p>
									<p>叶倩文</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="img/ASaf0fd1bf01b0d43df369e42e290d7fb6.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>飘雪</p>
									<p>陈慧娴</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="img/ASbb3be73e06916830921805061a3f1940.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>倒带 (Live)</p>
									<p>蔡依林</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="./img/ASc670cb2b51639bfc196154fa4b706d5e.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>死了都要爱 (电视剧《死了都要..</p>
									<p>信乐团</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="img/AS4da42a353bbb459c9577df8048db7735.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>小镇姑娘</p>
									<p>陶喆</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col-3">
									<div class="img-box">
										<img src="img/AS427929d94ebbd8449ff219d3612ee1da.jpg">
										<img src="./img/btn-play.png">
									</div>
								</div>
								<div class="col-7">
									<p>必杀技</p>
									<p>古巨基</p>
								</div>
								<div class="col-2">04:37</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="img/铃铛.png">
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- f5 -->
		<div class="f5">
			<div class="tbody">
				<img id="left" src="./img/left2.png">
				<img id="right" src="./img/向右2.png">
				<div class="cont-box">
			<div class="container">
				<p>专享数字专辑</p>
				<div class="content">
				<div class="row">
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/210813153728935_500x500_8201.jpg" >
							</div>
							</div>
							<p>Drown feat. Hikari Mitsushima</p>
							<p>和马-Kaz</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/211014102848247_800x800_7013.jpg" >
							</div>
							</div>
							<p>《在这世界的角落》电视原声</p>
							<p>久石譲</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="img/201124104030580_500x500_9841.jpg" >
							</div>
							</div>
							<p>Mojito</p>
							<p>周杰伦</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/210120100337271_300x300_96.jpg" >
							</div>
							</div>
							<p>《家族之苦3》电影原声</p>
							<p>久石譲</p>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/180621233157509_500x500_9297.jpg" >
							</div>
							</div>
							<p>欲望反光</p>
							<p>萧敬腾</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/210120100258835_300x300_5332.jpg" >
							</div>
							</div>
							<p>《家族之苦2 》电影原声</p>
							<p>久石譲</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/21091016273400_500x500_6549.jpg" >
							</div>
							</div>
							<p>CODE LOVE</p>
							<p>和马-Kaz</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/210824152941274_500x500_3916.jpg" >
							</div>
							</div>
							<p>北极的企鹅</p>
							<p>徐子未</p>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/210924151157137_800x800_6554.jpg" >
							</div>
							</div>
							<p>秘ME</p>
							<p>Sunnee杨芸晴</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/210622000126183_500x500_228.jpg" >
							</div>
							</div>
							<p>和.唱</p>
							<p>郑容和</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/210928175153354_500x500_9243.jpg" >
							</div>
							</div>
							<p>邃宇 Dark wings</p>
							<p>杨宇腾YU</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/18122323004695_500x500_2157.jpg" >
							</div>
							</div>
							<p>沙发海(Sofa Sea)</p>
							<p>陈绮贞</p>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/211015144512347_500x500_5404.jpg" >
							</div>
							</div>
							<p>=</p>
							<p>Ed Sheeran</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/21092413533686_500x500_852.jpg" >
							</div>
							</div>
							<p>去依赖</p>
							<p>庆怜</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/211011145039516_500x500_4901.jpg" >
							</div>
							</div>
							<p>模仿</p>
							<p>徐子未</p>
						</div>
					</div>
					<div class="col-3">
						<div class="box">
							<div class="img-box">
							<div class="play">
								<img src="./img/8e09ec01529ead4b.png" >
							</div>
							<div class="cover-img">
								<img src="./img/211019151629319_500x500_8169.jpg" >
							</div>
							</div>
							<p>剧院风情</p>
							<p>弗拉基米尔</p>
						</div>
					</div>
				</div>
				</div>
			</div>
			</div>
			</div>
		</div>
		<!-- f6 -->
		<div class="f6">
			<div class="container-fluid">
				<img src="./img/left2.png">
				<img src="./img/向右2.png">
			<div class="container">
				<p>会员彩铃专享库</p>
				<div class="cont">
				<div class="row">
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/ASd07189301490405ea7a8a239cbb919da.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>真爱无双</p>
									<p>阿兰</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/ASddbc4e4699ad3eb11839d2582721cafd.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>晴雅集（电影《晴雅集》同名宣..</p>
									<p>时代少年团</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/ASddbc4e4699ad3eb11839d2582721cafd.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>痴情冢 (电影《晴雅集》片尾曲)</p>
									<p>邓伦</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/ASc8d93a9778bcd3d475fd5ac5018a021d.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>在你不知道的时间里爱你很久</p>
									<p>徐佳莹</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/ASa0ca05469d7ba13d62e940ae331c6526.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>重生 (网剧《棋魂》热血主题曲)</p>
									<p>耿斯汉</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS9d5d74de9029e9dff146ded75a374830.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>跃进人海拥抱你 (电影《温暖的..</p>
									<p>张杰</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/ASb5daa83ce3e186ac7a64a100d4a87579.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>猎狐行动 (电影《猎狐行动》</p>
									<p>白举纲 / 马伯骞</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/ASaba5aa9cb85cd5e4aee0b7bf8a266666.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>我想要个男朋友(微短剧《做梦吧..</p>
									<p>sis</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/ASd5893965ab5d45e70dbcaa918426075e.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>我不知道的事(电影《精灵闺蜜》</p>
									<p>小时姑娘</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/ASfbb947db4f734f038f8c176fba7186fb.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>Desperado</p>
									<p>Eagles</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/ARTMad608dcdd4629c1184683bea76c1967f.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>Lose Again</p>
									<p>Alison Krauss / Union Sta</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS77b8a9a19638b6f5a7e21208d066cda5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>我只喜欢你(网络剧《我只喜欢你..</p>
									<p>胡夏</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS18eab4ef5a174aeba0bc002020d0dff5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>对你我甘心的战败</p>
									<p>吕宜人</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS18eab4ef5a174aeba0bc002020d0dff5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>关美阳的内心世界(弦乐四重奏版)</p>
									<p>张帅</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS3e60a16725c89b9ab5af4b5d9b62e5f9.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>It Doesnt Matter Any More</p>
									<p>Don Mclean</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS77b8a9a19638b6f5a7e21208d066cda5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>亲爱的你(网络剧《我只喜欢你..</p>
									<p>费定安</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS77b8a9a19638b6f5a7e21208d066cda5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>两万赫兹的距离(网络剧《我只喜..</p>
									<p>金大洲</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/ARTMe1c6cf1e3ac1e896a1ed7d8b3fdb3269.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>Man On The Street(Live 1961..</p>
									<p>Bob Dylan</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/AS3d763866fb105b7e7dec6cc2686af40b.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>Turn To Stone</p>
									<p>Eagles</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/ASed51b4fa901e7d6b58662a29fc78b017.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>藏不住的心跳(网络剧《我只喜欢..</p>
									<p>朱主爱</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/AS77b8a9a19638b6f5a7e21208d066cda5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>站你这边(网络剧《我只喜欢你...</p>
									<p>李佳洁 / 张悦</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS18eab4ef5a174aeba0bc002020d0dff5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>告别你(电视剧《爱是欢乐的源泉...</p>
									<p>王思远 / 吕宜人</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS18eab4ef5a174aeba0bc002020d0dff5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>天生爱人（电视剧《爱是欢乐的...</p>
									<p>潘萌竹</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS77b8a9a19638b6f5a7e21208d066cda5.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>最相爱的朋友(网络剧《我只喜欢...</p>
									<p>马栗</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/ASb5daa83ce3e186ac7a64a100d4a87579.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>猎狐行动 (电影《猎狐行动》</p>
									<p>马栗</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="img/AS226537fbe138e6bbe1a853d696e68899.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>Never let you go(网络剧《我只...</p>
									<p>萨吉</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
					<div class="col-4">
						<div class="box">
							<div class="row">
								<div class="col">
							<div class="img-box">
								<img src="./img/AS226537fbe138e6bbe1a853d696e68899.jpg" >
							</div>
								</div>
								<div class="col-7">
									<p>春光如此却不得你(网络剧《我...</p>
									<p>萨吉</p>
								</div>
								<div class="col-2">
									04:47
								</div>
							</div>
							<div class="cover-img">
								<img src="./img/爱心.png">
								<img src="img/1分享.png">
								<img src="./img/铃铛.png">
							</div>
						</div>
					</div>
				</div>
				</div>
				<div class="a-page">
					<span class="cur"></span>
					<span></span>
					<span></span>
				</div>
			</div>
			</div>
		</div>
		<!-- f7 -->
		<div class="f7">
			<div class="footer">
			<div class="container">
				<div class="row">
					<div class="col-9">
						<div class="row">
							<div class="col-4">
								<ul>
									<li><p>咪咕文化</p></li>
									<li><a href="#">咪咕文化官网</a></li>
									<li><a href="#">咪咕音乐简介</a></li>
									<li><a href="#">服务协议</a></li>
									<li><a href="#">隐私权政策</a></li>
								</ul>
							</div>
							<div class="col-4">
								<ul>
									<li><p>咪咕音乐家族</p></li>
									<li><a href="#">圈子彩铃</a></li>
								</ul>
							</div>
							<div class="col-4">
								<ul>
									<li><p>联系我们</p></li>
									<li><a href="#">业务合作</a></li>
									<li><a href="#">常见问题</a></li>
								</ul>
							</div>
						</div>
					</div>
					<div class="col-3">
						<p>咪咕客户端</p>
						<div class="row">
							<div class="col-6">
								<img src="img/20101209435723_300x300_1190.png" >
								<p>咪咕音乐</p>
							</div>
							<div class="col-6">
								<img src="img/201012094413724_300x300_8080.png" >
								<p>咪咕视频</p>
							</div>
						</div>
					</div>
				</div>
				<img src="img/201012095135561_48x48_9661.png" >
				<div class="ending">
					<div class="ending-left">
						<span>蜀ICP备15012512号</span>
						<span>川网文[2019]2118-124</span>
						<span>网络视听许可证0112648号1</span>
						<span>增值业务许可证A2.B1.B2-2010000</span>
						<span>川公网安备 51010702002209号</span>
					</div>
					<p>Copyright © 2005 - 2022 咪咕音乐有限公司</p>
				</div>
			</div>
			</div>
		</div>
		<script src="jquery-3.6.0.js"></script>
		<script>
		$('.f1 .container>.row>.col-4>div').mouseover(function(){
			$('.f1 .log_popup').stop(true).show(300)
		})
		$('.f1 .container>.row>.col-4>div').mouseleave(function(){
			$('.f1 .log_popup').stop(true).hide(300)
		})
		const lgin=document.querySelector('.lgin')
		lgin.onclick=()=>{
				logincover.style=`display: flex;`
			}
		login.onclick=()=>{
			logincover.style=`display: flex;`
		}
		clo.onclick=()=>{
			logincover.style=`display: none;`
		}
		$('.login-inter>div>input:first-child').on('input',function(){
				if($(this).val()==''){
					$('#hint').prop('class','')
					return
				}
			if(/^1[3-9]\d{9}$/.test($(this).val())){
				$('#hint').prop('class','ok')
			}else{
				$('#hint').prop('class','err')
			}
		})
		$('.login-inter>div>input:first-child').blur(function(){
			$('#hint').prop('class','')
		})
		$('#pwd>input:nth-of-type(2)').on('input',function(){
			const l=$(this).val()
			if(l==''){
				$('#tisi').prop('class','')
				return
			}
			if(l.length>12 || l.length<5){
				$('#tisi').prop('class','err')
			}else{
				$('#tisi').prop('class','ok')
			}
		})
		$('#pwd>input:nth-of-type(2)').blur(function(){
			$('#tisi').prop('class','')
		})
		$('.login-inter>.row').on('click','div',function(){
			$(this).addClass('cur').siblings().removeClass('cur')
			if($(this).text()=='短信登录'){
				phon.style.display=''
				pwd.style.display='none'
				SIM.style.display='none'
			}
			if($(this).text()=='密码登陆'){
				phon.style.display='none'
				pwd.style.display='block'
				SIM.style.display='none'
			}
			if($(this).text()=='SIM登录'){
				phon.style.display='none'
				pwd.style.display='none'
				SIM.style.display='block'
			}
		})
			let i=0
		$('#left').click(function(){
			i++
			if(i>3){
				i=3
				return
			}
			$('.f5 .row:first-child').stop(true).animate({marginLeft:i*-1230+'px'})
		})
		$('#right').click(function(){
			i--
			if(i<0){
				i=0
				return
			}
			$('.f5 .row:first-child').stop(true).animate({marginLeft:i*-1230+'px'})
		})
		$('.a-page').on('click','span',function(){
			$(this).prop('class','cur').siblings().prop('class','')
			const index=$(this).index()
			$('.f6 .cont>.row:first-child').stop(true).animate({marginLeft:index*-1230+'px'})
		})
		$('.f6 .container-fluid>img:first-child').click(function(){
			const index=$('.f6 .a-page>span.cur').index()+1
			const max_index=$('.f6 .a-page>span:last-child').index()
			if(index<=max_index){
				$('.f6 .a-page>span.cur').prop('class','').next().prop('class','cur')
				$('.f6 .cont>.row:first-child').stop(true).animate({marginLeft:index*-1230+'px'})
			}
		})
		$('.f6 .container-fluid>img:nth-child(2)').click(function(){
			const index=$('.f6 .a-page>span.cur').index()-1
			if(index>=0){
				$('.f6 .a-page>span.cur').prop('class','').prev().prop('class','cur')
				$('.f6 .cont>.row:first-child').stop(true).animate({marginLeft:index*-1230+'px'})
			}
		})
		</script>
</body>
</html>